<script setup>
import LfButton from '@/components/commonUI/LfButton.vue'
import LikeIcon from '@/components/svgComponents/LikeIcon.vue'
</script>

<template>
  <div class="flex flex-col gap-8 p-3">
    <div class="flex gap-8">
      <LfButton>按钮</LfButton>
      <LfButton type="primary">按钮</LfButton>
      <LfButton type="secondary">按钮</LfButton>
      <LfButton type="secondary-no-bg">按钮</LfButton>
    </div>
    <div class="flex gap-8">
      <LfButton :icon="LikeIcon" />
      <LfButton :icon="LikeIcon" type="primary" />
      <LfButton :icon="LikeIcon" type="secondary" />
      <LfButton :icon="LikeIcon" type="secondary-no-bg" />
    </div>

    <div class="flex gap-8">
      <LfButton size="small">按钮</LfButton>
      <LfButton size="small" type="primary">按钮</LfButton>
      <LfButton size="small" type="secondary">按钮</LfButton>
      <LfButton size="small" type="secondary-no-bg">按钮</LfButton>
    </div>

    <div class="flex gap-8">
      <LfButton size="small" :icon="LikeIcon" />
      <LfButton size="small" :icon="LikeIcon" type="primary" />
      <LfButton size="small" :icon="LikeIcon" type="secondary" />
      <LfButton size="small" :icon="LikeIcon" type="secondary-no-bg" />
    </div>
  </div>
</template>

<style scoped lang="scss"></style>
